<!-- /*
 * @Author: 谢力 843926058@qq.com
 * @Date:   2019-11-06
 * @Last Modified by:   谢力
 * @Last Modified time: 2019-11-07
 */ -->
<template>
    <div class="ui-mode-container ui-mode-box flex-col">
        <div class="ui-header-item gradient">
            <div class="ui-header-arraw prev" @click="handleHistory" @touchstart.stop>
                <i class="iconfont icon iconjiantou-zuo-cuxiantiao"></i>
            </div>
            <div class="ui-header-title">APP扫码功能</div>
            <div class="ui-header-arraw next flex-row align-center" @touchstart.stop @click="handleHome">
                <i class="iconfont icon iconi-home"></i>
            </div>
        </div>
        <div class="ui-mode-content flex1" ref="scroll">
            <template v-if="pageStatus">
                <div class="box mar-bottom-5">
                    <p class="title">扫码结果</p>
                    <div class="inner">
                        <textarea placeholder="扫码结果显示框(只读)" readonly v-model="scan_result" col="2"></textarea>
                    </div>
                </div>
                <div class="mt-scan-submit" @click="appScan()">点击扫码</div>
            </template>
        </div>
    </div>
</template>
<script>
import mixinCommon from '@/views/content/mixins/common';
import mixinRequest from '@/views/content/mixins/request';
import mixinShare from '@/views/content/mixins/share';
export default {
    name: 'my',
    data(){
        return {
            public_agent_info:{},
            public_user_info:{},
            scan_result:''
        };
    },
    mixins:[
        mixinCommon,
        mixinRequest,
        mixinShare
    ],
    components:{
    },
    computed:{
    },
    watch:{
        resourceLoaded:{
            handler(flag){
                flag&&this.$nextTick(this.init);
            },
            immediate:true
        }
    },
    created(){
    },
    mounted(){
    },
    methods:{
        /*
         * 初始化
         */
        init(){
            let public_agent_info=this.$store.state.global.public_agent_info,
                public_user_info=this.$store.state.global.public_user_info;
            if(public_agent_info&&public_user_info){
                this.public_agent_info=public_agent_info;
                this.public_user_info=public_user_info;
                document.title=this.public_agent_info.application_name;
                this.showContent();
            }else{
                this.getPageInfo({
                    name:'my',
                    param:{
                        invoke_method:'user_and_shop_info'
                    }
                }).then(({result,response})=>{
                    this.public_agent_info=result.public_agent_info||{};
                    this.public_user_info=result.public_user_info||{};
                    document.title=this.public_agent_info.application_name;
                    this.setState({
                        key:'public_agent_info',
                        value:this.public_agent_info
                    });
                    this.setState({
                        key:'public_user_info',
                        value:this.public_user_info
                    });
                });
            };
        },
        /*
         * 请求失败刷新
         */
        handleRefresh(){
            this.init();
        },
        appScan(){
            this.$native.scan(data=>{
                if(data){
                    console.log(data)
                    this.scan_result=data;
                }else{
                    this.showMessage('无法识别！');
                };
            });
        },
    },
    beforeDestroy(){
    }
}
</script>
<style lang="less" scoped>
.box{
    padding:0 0.5rem;
    .title{
        font-size:0.8rem;
        line-height:2.6rem;
    }
    .inner{
        textarea{
            border:none;
            border:solid 1px #d8d8d8;
            font-size:0.7rem;
            padding:.32rem;
            line-height:1.2rem;
            width:100%;
            height:8rem;
            overflow:hidden;
            &:focus{
                border-color:@base-color;
            }
        }
    }
}
.mt-scan-submit{
    margin:1rem .85rem;
    background:#009FAB;
    text-align: center;
    color: #fff;
    padding: .3rem;
    font-size:.85rem;
}
</style>
